<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link type="text/css" rel="stylesheet" href="css/style.css" />
    <!--[if IE 6]>
    <script src="js/iepng.js" type="text/javascript"></script>
        <script type="text/javascript">
           EvPNG.fix('div, ul, img, li, input, a'); 
        </script>
    <![endif]-->
        
    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="js/menu.js"></script>    
        
	<script type="text/javascript" src="js/select.js"></script>
        
    
<title>用户中心</title>
</head>
<body>  
<jsp:include page="top2.jsp" />
<div class="i_bg bg_color">
    <!--Begin 用户中心 Begin -->
	<div class="m_content">
   		<div class="m_left">
        	<div class="left_n">管理中心</div>
            <div class="left_m">
            	<div class="left_m_t t_bg1">订单中心</div>
                <ul>
                	<li><a href="BaseOrderServlet?method=findOrderByUserId">我的订单</a></li>
                    <li><a href="AddressServlet?method=findAll">收货地址</a></li>
                    <li><a href="#">缺货登记</a></li>
                    <li><a href="#">跟踪订单</a></li>
                </ul>
            </div>
            <div class="left_m">
            	<div class="left_m_t t_bg2">会员中心</div>
                <ul>
                	<li><a href="member_user.jsp" class="now">用户信息</a></li>
                    <li><a href="Member_Collect.html">我的收藏</a></li>
                    <li><a href="Member_Msg.html">我的留言</a></li>
                    <li><a href="Member_Links.html">推广链接</a></li>
                    <li><a href="#">我的评论</a></li>
                </ul>
            </div>
            <div class="left_m">
            	<div class="left_m_t t_bg3">账户中心</div>
                <ul>
                	<li><a href="member_safe.jsp">账户安全</a></li>
                    <li><a href="Member_Packet.html">我的红包</a></li>
                    <li><a href="FundServlet?method=findByUserId">资金管理</a></li>
                </ul>
            </div>
            <div class="left_m">
            	<div class="left_m_t t_bg4">分销中心</div>
                <ul>
                	<li><a href="Member_Member.html">我的会员</a></li>
                    <li><a href="Member_Results.html">我的业绩</a></li>
                    <li><a href="Member_Commission.html">我的佣金</a></li>
                    <li><a href="Member_Cash.html">申请提现</a></li>
                </ul>
            </div>
        </div>
		<div class="m_right">
        	<div class="m_des">
            	<table border="0" style="width:870px; line-height:22px;" cellspacing="0" cellpadding="0">
                  <tr valign="top">
                    <td width="115">
                    	<c:if test="${empty user.face }">
                    		<img src="images/user.jpg" width="90" height="90" title="点击修改头像" onclick="upload()" />
                    	</c:if>
                    	<c:if test="${!empty user.face }">
                    		<img src="upload/${user.face }" width="90" height="90" title="点击修改头像" onclick="upload()" />
                    	</c:if>
                    	<form action="FaceServlet" method="post" enctype="multipart/form-data">
                    		<input id="face" type="file" name="face" style="display: none" onchange="submit()" />
                    	</form>
                    </td>
                    <td>
                    	<div class="m_user"><span onclick="editNickName(this)" title="点击修改昵称">${user.nickName }</span></div>
                        <p>
                            等级：注册用户 <br />
                            <font color="#ff4e00">您还差 270 积分达到 分红100</font><br />
                            上一次登录时间: 2015-09-28 18:19:47<br />
                            您还没有通过邮件认证 <a href="#" style="color:#ff4e00;">点此发送认证邮件</a>
                        </p>
                        <div class="m_notice">
                        	用户中心公告！
                        </div>
                    </td>
                  </tr>
                </table>	
            </div>
            
            <div class="mem_t">资产信息</div>
            <table border="0" class="mon_tab" style="width:870px; margin-bottom:20px;" cellspacing="0" cellpadding="0">
              <tr>
                <td width="33%">用户等级：<span style="color:#555555;">普通会员</span></td>
                <td width="33%">消费金额：<span>￥200元</span></td>
                <td width="33%">返还积分：<span>99R</span></td>
              </tr>
              <tr>
                <td>账户余额：<span>￥200元</span></td></td>
                <td>红包个数：<span style="color:#555555;">3个</span></td></td>
                <td>红包价值：<span>￥50元</span></td></td>
              </tr>
              <tr>
                <td colspan="3">订单提醒：
                	<font style="font-family:'宋体';">待付款(<span>0</span>) &nbsp; &nbsp; &nbsp; &nbsp; 待收货(<span>2</span>) &nbsp; &nbsp; &nbsp; &nbsp; 待评论(<span>1</span>)</font>
                </td>
              </tr>
            </table>

            <div class="mem_t">账号信息</div>
            <table border="0" class="mon_tab" style="width:870px; margin-bottom:20px;" cellspacing="0" cellpadding="0">
              <tr>
                <td width="40%">用户ID：<span style="color:#555555;">${user.id }</span></td>
                <td width="60%">邀请人：<span style="color:#555555;">邀请人姓名</span></td>
              </tr>
              <tr>
                <td>电&nbsp; &nbsp; 话：<span style="color:#555555;" title="点击修改" onclick="editPhone(this)">${user.phone }</span></td>
                <td>邮&nbsp; &nbsp; 箱：<span style="color:#555555;" title="点击修改" onclick="editEmail(this)">${user.email }</span></td>
              </tr>
              <tr>
                <td>身份证号：
                	<span style="color:#555555;">
                		<c:if test="${empty user.idCardNo }">点击填写</c:if>
                		${user.idCardNo }
                	</span>
                </td>
                <td>注册时间：<span style="color:#555555;">2015-10-10</span></td>
              </tr>
            </table>
               
            
        </div>
    </div>
	<!--End 用户中心 End--> 
    <!--Begin Footer Begin -->
    <div class="b_btm_bg b_btm_c">
        <div class="b_btm">
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0" cellpadding="0">
              <tr>
                <td width="72"><img src="images/b1.png" width="62" height="62" /></td>
                <td><h2>正品保障</h2>正品行货  放心购买</td>
              </tr>
            </table>
			<table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0" cellpadding="0">
              <tr>
                <td width="72"><img src="images/b2.png" width="62" height="62" /></td>
                <td><h2>满38包邮</h2>满38包邮 免运费</td>
              </tr>
            </table>
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0" cellpadding="0">
              <tr>
                <td width="72"><img src="images/b3.png" width="62" height="62" /></td>
                <td><h2>天天低价</h2>天天低价 畅选无忧</td>
              </tr>
            </table>
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0" cellpadding="0">
              <tr>
                <td width="72"><img src="images/b4.png" width="62" height="62" /></td>
                <td><h2>准时送达</h2>收货时间由你做主</td>
              </tr>
            </table>
        </div>
    </div>
    <div class="b_nav">
    	<dl>                                                                                            
        	<dt><a href="#">新手上路</a></dt>
            <dd><a href="#">售后流程</a></dd>
            <dd><a href="#">购物流程</a></dd>
            <dd><a href="#">订购方式</a></dd>
            <dd><a href="#">隐私声明</a></dd>
            <dd><a href="#">推荐分享说明</a></dd>
        </dl>
        <dl>
        	<dt><a href="#">配送与支付</a></dt>
            <dd><a href="#">货到付款区域</a></dd>
            <dd><a href="#">配送支付查询</a></dd>
            <dd><a href="#">支付方式说明</a></dd>
        </dl>
        <dl>
        	<dt><a href="#">会员中心</a></dt>
            <dd><a href="#">资金管理</a></dd>
            <dd><a href="#">我的收藏</a></dd>
            <dd><a href="#">我的订单</a></dd>
        </dl>
        <dl>
        	<dt><a href="#">服务保证</a></dt>
            <dd><a href="#">退换货原则</a></dd>
            <dd><a href="#">售后服务保证</a></dd>
            <dd><a href="#">产品质量保证</a></dd>
        </dl>
        <dl>
        	<dt><a href="#">联系我们</a></dt>
            <dd><a href="#">网站故障报告</a></dd>
            <dd><a href="#">购物咨询</a></dd>
            <dd><a href="#">投诉与建议</a></dd>
        </dl>
        <div class="b_tel_bg">
        	<a href="#" class="b_sh1">新浪微博</a>            
        	<a href="#" class="b_sh2">腾讯微博</a>
            <p>
            服务热线：<br />
            <span>400-123-4567</span>
            </p>
        </div>
        <div class="b_er">
            <div class="b_er_c"><img src="images/er.gif" width="118" height="118" /></div>
            <img src="images/ss.png" />
        </div>
    </div>    
    <div class="btmbg">
		<div class="btm">
        	备案/许可证编号：蜀ICP备12009302号-1-www.dingguagua.com   Copyright © 2015-2018 尤洪商城网 All Rights Reserved. 复制必究 , Technical Support: Dgg Group <br />
            <img src="images/b_1.gif" width="98" height="33" /><img src="images/b_2.gif" width="98" height="33" /><img src="images/b_3.gif" width="98" height="33" /><img src="images/b_4.gif" width="98" height="33" /><img src="images/b_5.gif" width="98" height="33" /><img src="images/b_6.gif" width="98" height="33" />
        </div>    	
    </div>
    <!--End Footer End -->    
</div>

</body>


<!--[if IE 6]>
<script src="//letskillie6.googlecode.com/svn/trunk/2/zh_CN.js"></script>
<![endif]-->
</html>
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
<script>
	var oldPhone;
	//点击电话编辑
	function editPhone(obj){
		oldPhone = obj.innerHTML;
		$(obj).parent().append('<input type="text" id="phone" name="phone" onblur="savePhone(this)" value="'+obj.innerHTML+'" />');
		$(obj).remove();
		$("#phone").focus();//聚焦
	}
	
	//保存电话
	function savePhone(obj){
		//手机号格式验证
		if(obj.value.charAt(0)!="1"||obj.value.length!=11){
			alert("手机号格式错误！")
			return;
		}
		//验证手机号有没有修改
		if(oldPhone==obj.value){
			$(obj).parent().append('<span style="color:#555555;" title="点击修改" onclick="editPhone(this)">'+obj.value+'</span>');
			$(obj).remove();
			return;
		}
		//发送异步请求，保存电话
		$.get(
				"UserServlet?method=savePhone",//请求地址
				{
					phone:obj.value
				},//请求参数
				function(res){//回调函数（请求成功后执行）
					if(res=="success"){
						$(obj).parent().append('<span style="color:#555555;" title="点击修改" onclick="editPhone(this)">'+obj.value+'</span>');
						$(obj).remove();
					}else{
						alert(res)
					}
				},
				"text"//返回值类型，text表示文本
			);
		
	}
	
	var oldEmail;
	//点击邮箱编辑
	function editEmail(obj){
		oldEmail = obj.innerHTML;
		$(obj).parent().append('<input type="text" id="email" name="email" onblur="saveEmail(this)" value="'+obj.innerHTML+'" />');
		$(obj).remove();
		$("#email").focus();//聚焦
	}
	
	//保存电话
	function saveEmail(obj){
		//邮箱格式验证
		if(obj.value.indexOf('@')<0){
			alert("邮箱格式错误！")
			return;
		}
		//验证邮箱有没有修改
		if(oldEmail==obj.value){
			$(obj).parent().append('<span style="color:#555555;" title="点击修改" onclick="editEmail(this)">'+obj.value+'</span>');
			$(obj).remove();
			return;
		}
		//发送异步请求，保存新邮箱
		$.get(
				"UserServlet?method=saveEmail",//请求地址
				{
					email:obj.value
				},//请求参数
				function(res){//回调函数（请求成功后执行）
					if(res=="success"){
						$(obj).parent().append('<span style="color:#555555;" title="点击修改" onclick="editEmail(this)">'+obj.value+'</span>');
						$(obj).remove();
					}else{
						alert(res)
					}
				},
				"text"//返回值类型，text表示文本
			);
		
	}
	
	//点击修改昵称
	function editNickName(obj){
		$(obj).parent().html('<input type="text" id="nickname" name="nickname" onblur="saveNickName(this)" value="'+obj.innerHTML+'"/>');
		$("#nickname").focus();
	}
	//保存昵称
	function saveNickName(obj){
		//昵称长度验证
		if(obj.value.length==0){
			alert('请填写昵称')
			return;
		}
		//发送异步请求，保存昵称
		$.get(
				"UserServlet?method=saveNickName",//请求地址
				{
					nickname:obj.value
				},//请求参数
				function(res){//回调函数（请求成功后执行）
					if(res=="success"){
						$(obj).parent().html('<span onclick="editNickName(this)" title="点击修改昵称">'+obj.value+'</span>');
						$(obj).remove();
					}else{
						alert(res)
					}
				},
				"text"//返回值类型，text表示文本
			);
	}
	
	//点击头像修改图片
	function upload(){
		$("#face").click();
	}
</script>
    